    
<template>
  <div style="padding: 10px 15px">
    <div class="filter-container">
      <el-select v-if="this.logincpnid == 'system'" v-model="listQuery.cpnID" filterable clearable class="filter-item"
        :filter-method="cpnmatch" @clear="cpnmatch" placeholder="请选择企业">
        <el-option v-for="item in cpnoptionsCopy" :key="item.value" :label="item.label" :value="item.value">
          <span v-html="item.label" />
        </el-option>
      </el-select>

      <el-input v-model="listQuery.payOrg" placeholder="请输入支付宝门店号" style="width: 200px" class="filter-item" clearable
        @keyup.enter.native="handleFilter" />
      <el-input v-model="listQuery.smid" placeholder="请输入SMID" style="width: 200px" class="filter-item" clearable
        @keyup.enter.native="handleFilter" />

      <el-input v-model="listQuery.bizTid" placeholder="请输入设备id" style="width: 200px" class="filter-item" clearable
        @keyup.enter.native="handleFilter" />

      <el-button class="filter-item seachbttn" type="primary" icon="el-icon-search" @click="handleFilter">查询</el-button>
    </div>
    <div class="filter_fenge" style="border: none; border-top: 1px solid #d1ddeb" />
    <div class="filter-container">
      <el-button class="filter-item bttnleft" style="margin-left: 10px" type="primary" icon="el-icon-edit"
        @click="handleCreate()">新增</el-button>

      <el-button class="filter-item" type="danger" icon="el-icon-delete" @click="deleteClick()">删除</el-button>
      <el-button class="filter-item" style="margin-left: 10px" type="primary" icon="el-icon-edit"
        @click="handleImport()">导入</el-button>
    </div>
    <!--table-->
    <el-table ref="multipleTable" v-loading="listLoading" :data="alipayDev_Data" fit highlight-current-row stripe
      show-header style="width: 100%" @selection-change="handleSelectionChange">
      <!-- :span-method="objectSpanMethod" -->
      <el-table-column type="selection" width="55"  label="选择"/>




      <!-- <el-table-cloumn label="分组1" key="分组1"> 

        <el-table-column :prop="`cpnName`" label="金额"></el-table-column>
        <el-table-column :prop="`pcmaymhineAlisName`" label="笔数"></el-table-column>
      </el-table-cloumn> -->
      <el-table-column label="企业名称" align="left" min-width="120px">
        <template slot-scope="{ row }">
          <span>{{ row.cpnName }}</span>
        </template>
      </el-table-column>
      <el-table-column label="前置机名称" align="left" min-width="120px">
        <template slot-scope="{ row }">
          <span>{{ row.pcmaymhineAlisName }}</span>
        </template>
      </el-table-column>
      <el-table-column label="区域代码" align="left" min-width="80px">
        <template slot-scope="{ row }">
          <span>{{ row.area }}</span>
        </template>
      </el-table-column>
    <el-table-column label="设备信息" align="center" >
      <el-table-column label="绑定" align="left" min-width="60px">
        <template slot-scope="{ row }">
          <el-tag v-if="row.isBind == 0" type="info">否</el-tag>
          <el-tag v-else type="danger">是</el-tag>
          <!-- <span >{{ (row.isBind==0?"否":"是") }}</span> -->
        </template>
      </el-table-column>
      <el-table-column label="SMID(支付宝商户号/间连支付宝商户号)" align="left" min-width="300px">
        <template slot-scope="{ row }">
          <span>{{ row.smid }}</span>
        </template>
      </el-table-column>
      <el-table-column label="支付宝门店号/间连支付宝门店号" align="left" min-width="300px">
        <template slot-scope="{ row }">
          <span>{{ row.payOrg }}</span>
        </template>
      </el-table-column>

      <el-table-column label="设备号SN" align="left" min-width="150px">
        <template slot-scope="{ row }">
          <span>{{ row.devSn }}</span>
        </template>
      </el-table-column>

      <el-table-column label="设备id" align="left" min-width="150px">
        <template slot-scope="{ row }">
          <span>{{ row.bizTid }}</span>
        </template>
      </el-table-column>
    </el-table-column>

     
    <el-table-column label="ERP支付信息" align="center" >
      <el-table-column label="erp门店号" min-width="120px">
        <template slot-scope="scope">
          <el-input v-if="editRow == scope.$index" v-model="scope.row.erpOrg" clearble />
          <span v-else>{{ scope.row.erpOrg }}</span>
          <!-- {{ scope.$index }} -->
          <!-- <el-form-item :prop="`item.${scope.$index}.erpOrg`" :rules="form.rules.erpOrg">
            <el-input v-if="editRow == scope.$index" v-model="scope.row.erpOrg" clearble />
            <span v-else>{{ scope.row.erpOrg }}</span>
          </el-form-item> -->
        </template>
      </el-table-column>
      
      <el-table-column label="erp收银设备" min-width="120px">
        <template slot-scope="scope">
          <el-input v-if="editRow == scope.$index" v-model="scope.row.erpPosID" clearble />
          <span v-else>{{ scope.row.erpPosID }}</span>
          <!-- <el-form-item prop="ErpPosID">
            <el-input v-if="editRow == scope.$index" v-model="scope.row.erpPosID" clearble />
            <span v-else>{{ scope.row.erpPosID }}</span>
          </el-form-item> -->
        </template>
      </el-table-column>
      <el-table-column label="erp收银员" min-width="120px">
        <template slot-scope="scope">
          <el-input v-if="editRow == scope.$index" v-model="scope.row.erpRcv" clearble />
          <span v-else>{{ scope.row.erpRcv }}</span>
          <!-- <el-form-item prop="ErpRcv">
            <el-input v-if="editRow == scope.$index" v-model="scope.row.erpRcv" clearble />
            <span v-else>{{ scope.row.erpRcv }}</span>
          </el-form-item> -->
        </template>
      </el-table-column>
      
    </el-table-column>

      



      


      <!-- <el-table-column label="类型" align="left" min-width="150px">
        <template slot-scope="{ row }">
          <span>{{ row.typ }}</span>
        </template>
      </el-table-column>




      <el-table-column label="区域代码" align="left" min-width="150px">
        <template slot-scope="{ row }">
          <span>{{ row.area }}</span>
        </template>
      </el-table-column>


      <el-table-column label="账户" align="left" min-width="150px">
        <template slot-scope="{ row }">
          <span>{{ row.mrChNo }}</span>
        </template>
                        </el-table-column> -->

      <!-- <el-table-column label="erp门店" align="left" min-width="150px">
        <template slot-scope="{ row }">
          <span>{{ row.erpOrg }}</span>
        </template>
      </el-table-column>

      <el-table-column label="erp收银机" align="left" min-width="150px">
        <template slot-scope="{ row }">
          <span>{{ row.erpPosID }}</span>
        </template>
      </el-table-column>

      <el-table-column label="erp收银员" align="left" min-width="150px">
        <template slot-scope="{ row }">
          <span>{{ row.erpRcv }}</span>
        </template>
      </el-table-column> -->




      <el-table-column fixed="right" label="操作" width="320px">
        <template slot-scope="scope">
          <el-button v-if="scope.row.isBind == 0" type="primary" size="mini"
            @click="bindDevice([scope.row.id], true)">绑定</el-button>
          <el-button v-else-if="scope.row.isBind != 0" type="danger" size="mini"
            @click="bindDevice([scope.row.id])">解绑</el-button>
          <!-- <el-button type="primary" size="mini" @click="handleClick(scope.row, scope.$index)">查看信息</el-button> -->
          <el-button type="primary" size="mini" @click="showDevinfo(scope)">查看信息</el-button>
          <el-button type="primary" size="mini" @click="handleClick(scope.row, scope.$index,0,'编辑',1)"
            v-if="editRow != scope.$index">编辑</el-button>
          <!-- <el-button type="primary" size="mini" @click="editOk(scope.row, scope.$index)"
            v-if="editRow != scope.$index">编辑</el-button> -->
          <!-- <el-button type="primary" size="mini" @click="saveRowBtn(scope)"
            v-else-if="editRow == scope.$index">保存</el-button> -->
          <el-button type="primary" size="mini" @click="delListBtn(scope)"
            :disabled="scope.row.isBind != 0">删除</el-button>

        </template>
      </el-table-column>

      <!-- <el-table-column fixed="right" label="操作" width="140px">
        <template slot-scope="scope">
          <el-button
            type="primary"
            size="mini"
            @click="handleClick(scope.row, scope.$index)"
            >查看信息</el-button
          >
        </template>
      </el-table-column> -->
    </el-table>

    <pagination v-show="listQuery.total > 0" :total="listQuery.total" :page.sync="listQuery.page"
      :limit.sync="listQuery.limit" @pagination="fetchData(this)" />

    <!--table-->
    <!--弹出层 alipayDev模块-->
    <el-dialog :title="form.title" :visible.sync="dialogFormVisible" width="76%" :before-close="handleClose"
      @close="handleClose" :show-close="false">
      <el-form ref="refSaveForm" :model="form" :inline="true" label-position="right" :hide-required-asterisk="false"
        :show-message="false">

        <el-form-item label="企业" prop="CpnID">

          <el-select :key="dialogFormVisible" :disabled="cpnSelectDisabled || this.logincpnid != 'system'"
            v-model="form.CpnID" filterable clearable class="filter-item" :filter-method="cpnmatch"
            @change="(val) => formCpnChange(val, true && !showImportState)" @clear="cpnmatch" placeholder="请选择企业">

            <el-option v-for="item in cpnoptionsCopy" :key="item.value" :label="item.label" :value="item.value">
              <span v-html="item.label" />
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="Excel文件" v-if="showImportState">
          <upload-excel-component class="filter-item" :disabled="!form.CpnID" :onSuccess="handleExcelSuccess"
            :before-upload="beforeUpload" :title="'上传'" :btnSize="'medium'" />
        </el-form-item>

        <el-table :data="form.item" fit highlight-current-row style="width: 100%">
          <el-table-column type="index" label="序号"></el-table-column>
          <el-table-column label="前置机" min-width="160px">
            <template slot-scope="scope">
              <el-form-item :prop="`item.${scope.$index}.pcmaymhineID`" :rules="form.rules.pcmaymhineID">
                <el-row>
                  <el-col :span="22">
                    <el-select v-if="editRow == scope.$index"
                      @change="onPcmaymhineChange($event,scope)"
                      v-model="scope.row.pcmaymhineID">
                      <el-option v-for="item in pcmaymhineList" :label="item.pcmaymhineAlisName"
                        :value="item.pcmaymhineID" :key="item.value">
                        <!-- <i class="el-icon-warning" ></i>{{ item.pcmaymhineAlisName }} -->
                      </el-option>
                        
                    </el-select>
                    <span v-else-if="scope.row.pcmaymhineID.length > 0"
                      :key="pcmaymhineList.length">{{ pcmaymhineDic[scope.row.pcmaymhineID] }}</span>
                    <span v-else>无</span></el-col>
                  <el-col :span="2">
                    <el-tooltip class="item" effect="dark" :content="`${form.item[scope.$index].act}|${form.item[scope.$index].payChannelName}`" placement="top-start"  v-if="scope.row.pcmaymhineID.length > 0">
                      <i class="el-icon-warning"></i>
                    </el-tooltip>
                    
                  </el-col>
                </el-row>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="支付宝门店号/间连支付宝门店号" min-width="300px">
            <template slot-scope="scope">
              <el-form-item :prop="`item.${scope.$index}.payOrg`" :rules="form.rules.payOrg">
                <el-input v-if="editRow == scope.$index && addRow == scope.$index" v-model="scope.row.payOrg" clearble
                  placeholder="必填" />
                <span v-else>{{ scope.row.payOrg }}</span>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="SMID(支付宝商户号/间连支付宝商户号)" min-width="300px">
            <template slot-scope="scope">
              <el-form-item :prop="`item.${scope.$index}.smid`" required :rules="form.rules.smid">
                <el-input v-if="editRow == scope.$index && addRow == scope.$index" v-model="scope.row.smid" clearble
                  placeholder="必填" />
                <span v-else>{{ scope.row.smid }}</span>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="设备号SN" min-width="150px">
            <template slot-scope="scope">
              <el-form-item :prop="`item.${scope.$index}.devSn`" required :rules="form.rules.devSn">
                <el-input v-if="editRow == scope.$index && addRow == scope.$index" v-model="scope.row.devSn" clearble
                  placeholder="必填" />
                <span v-else>{{ scope.row.devSn }}</span>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="设备id" min-width="280px">
            <template slot-scope="scope">
              <el-form-item :prop="`item.${scope.$index}.bizTid`" :rules="form.rules.bizTid">
                <el-input v-if="editRow == scope.$index && addRow == scope.$index" v-model="scope.row.bizTid" clearble
                  placeholder="必填" />
                <span v-else>{{ scope.row.bizTid }}</span>
              </el-form-item>

              <!-- <el-tooltip v-else class="item" effect="dark" :content="scope.row.bizTid" placement="top">
                <span>{{ scope.row.bizTid }}</span>
                              </el-tooltip> -->
            </template>
          </el-table-column>
          <el-table-column label="erp门店号" min-width="120px">
            <template slot-scope="scope">
              <el-form-item :prop="`item.${scope.$index}.erpOrg`" :rules="form.rules.erpOrg">
                <el-input v-if="editRow == scope.$index" v-model="scope.row.erpOrg" clearble placeholder="非必填" />
                <span v-else>{{ scope.row.erpOrg }}</span>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="erp收银设备" min-width="120px">
            <template slot-scope="scope">
              <el-form-item prop="ErpPosID">
                <el-input v-if="editRow == scope.$index" v-model="scope.row.erpPosID" clearble placeholder="非必填" />
                <span v-else>{{ scope.row.erpPosID }}</span>
              </el-form-item>

              <!-- <el-tooltip v-else class="item" effect="dark" :content="scope.row.erpPosID" placement="top">
                <span>{{ scope.row.erpPosID }}</span>
                              </el-tooltip> -->
            </template>
          </el-table-column>
          <el-table-column label="erp收银员" min-width="120px">
            <template slot-scope="scope">
              <el-form-item prop="ErpRcv">
                <el-input v-if="editRow == scope.$index" v-model="scope.row.erpRcv" clearble placeholder="非必填" />
                <span v-else>{{ scope.row.erpRcv }}</span>
              </el-form-item>
            </template>
          </el-table-column>

          <el-table-column fixed="right" label="操作" width="240px">
            <template slot-scope="scope">
              <el-button size="mini" @click="editOk(scope.row, scope.$index)"
                v-if="editRow != scope.$index">编辑</el-button>
              <el-button size="mini" @click="saveRow"
                v-else-if="addRow == scope.$index || editRow == scope.$index">保存</el-button>
              <el-button size="mini" @click="delList(scope.row, scope.$index)" :disabled="scope.row.isBind != 0">删除</el-button>
              <!-- <el-button
                v-if="editRow != scope.$index && scope.row.isBind == 0"
                size="mini"
                @click="addBindDevice(scope.row, scope.$index)"
                >绑定</el-button
              >
              <el-button
                v-else-if="editRow != scope.$index && scope.row.isBind != 0"
                size="mini"
                @click="addBindDevice(scope.row, scope.$index)"
                >解绑</el-button> -->
            </template>
          </el-table-column>
        </el-table>
        <el-button v-if="!showImportState" @click="addList"
          :disabled="(addRow != -1 && form.item.length > 0) || form.CpnID.length == 0">
          +加一行
        </el-button>

        <!-- <el-form-item label="设备号" prop="DevSn">
          <el-input v-model="alipayDev_form.DevSn" />
        </el-form-item>

        <el-form-item label="设备id" prop="BizTid">
          <el-input v-model="alipayDev_form.BizTid" />
        </el-form-item>

        <el-form-item label="SMID" prop="SMID">
          <el-input v-model="alipayDev_form.SMID" />
        </el-form-item>

        <el-form-item label="类型" prop="Typ">
          <el-input v-model="alipayDev_form.Typ" />
        </el-form-item>

        <el-form-item label="支付宝门店号" prop="PayOrg">
          <el-input v-model="alipayDev_form.PayOrg" />
        </el-form-item>

        <el-form-item label="区域代码" prop="Area">
          <el-input v-model="alipayDev_form.Area" />
        </el-form-item>

        <el-form-item label="账户" prop="MrChNo">
          <el-input v-model="alipayDev_form.MrChNo" />
        </el-form-item>

        <el-form-item label="erp门店" prop="ErpOrg">
          <el-input v-model="alipayDev_form.ErpOrg" />
        </el-form-item>

        <el-form-item label="erp收银机" prop="ErpPosID">
          <el-input v-model="alipayDev_form.ErpPosID" />
        </el-form-item>

        <el-form-item label="erp收银员" prop="ErpRcv">
          <el-input v-model="alipayDev_form.ErpRcv" />
                          </el-form-item> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogCancel()">取 消</el-button>
        <el-button type="primary" @click="dialogConfirm()"
          :disabled="isConfirm || (form.item.length == 0 && form.removeIdList.length == 0)">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog :title="'设备详情'" :visible.sync="showDialogVisible" width="76%" :show-close="true">
      <el-descriptions :column="1" border>
        <el-descriptions-item label="企业名称">{{ showDevRow.cpnName }}</el-descriptions-item>
        <el-descriptions-item label="前置机">{{ showDevRow.pcmaymhineAlisName }}</el-descriptions-item>
        <el-descriptions-item label="区域代码">{{ showDevRow.area }}</el-descriptions-item>
        <el-descriptions-item label="支付宝门店号">{{ showDevRow.payOrg }}</el-descriptions-item>
        <el-descriptions-item label="SMID">{{ showDevRow.smid }}</el-descriptions-item>
        <el-descriptions-item label="设备号">{{ showDevRow.devSn }}</el-descriptions-item>
        <el-descriptions-item label="设备ID">{{ showDevRow.bizTid }}</el-descriptions-item>
        <el-descriptions-item label="erp门店号">{{ showDevRow.erpOrg }}</el-descriptions-item>
        <el-descriptions-item label="erp收银设备">{{ showDevRow.erpPosID }}</el-descriptions-item>
        <el-descriptions-item label="erp操作员">{{ showDevRow.erpRcv }}</el-descriptions-item>
        <el-descriptions-item label="是否绑定">
          <el-tag v-if="showDevRow.isBind == 0" type="info">否</el-tag>
          <el-tag v-else type="danger">是</el-tag>
        </el-descriptions-item>
      </el-descriptions>
    </el-dialog>
  </div>
</template>

<script>
import UploadExcelComponent from "@/components/UploadExcel/index.vue";
import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
import { AjaxToken } from "@/api/common";
import { AjaxGet } from "@/api/common";
import { SelectAjax } from "@/api/common";
import sessionStorage from "@/api/Storage";
import PinYinMatch from "pinyin-match";
import mapObjUtil from "@/utils/mapObjUtil"
import "url-search-params-polyfill";
import nestedRouter from '@/router/modules/nested';
const mapHeaderDic = {
  "SMID": "smid",
  "erp收银员": "erpRcv",
  "erp收银设备": "erpPosID",
  "erp门店号": "erpOrg",
  "支付宝门店号": "payOrg",
  "设备号": "devSn",
  "设备ID": "bizTid",
};
// this.form.item.push({
//         ID: "",
//         pcmaymhineID: "",
//         cpnID: this.logincpnid == "system" ? this.form.CpnID : this.logincpnid,
//         devSn: "",
//         bizTid: "",
//         smid: "",
//         typ: 0,
//         payOrg: "",
//         area: "",
//         mrChNo: "",
//         erpOrg: "",
//         erpPosID: "",
//         erpRcv: "",
//         pcmaymhineAlisName: "",
//         dt: "0001-01-01T00:00:00",
//         isNew: true,
//         isUpdate: false,
//         isBind: 0,
//       });
export default {
  name: "Manager",
  components: { Pagination, UploadExcelComponent },
  data() {
    let _dialogFormVisible = false;
    return {
      loginid: "",
      logincpnid: "",
      formLabelWidth: "120px",
      alipayDev_Data: null,
      listQuery: {
        title: "",
        total: 0,
        page: 1,
        limit: 10,
        cpnID: "",
        smid: "",
        payOrg: "",
        bizTid: "",
      },
      listLoading: true,
      // dialogFormVisible: {
      //   getters(){
      //     return _dialogFormVisible;
      //   },
      //   setters(val){
      //     _dialogFormVisible=val;
      //   }
      // },
      dialogFormVisible: false,
      showDialogVisible: false,
      showImportState: false,
      showDevRow: {},
      dialoRoleVisible: false,
      dialogPawssdVisible: false,
      dialogInfoVisible: false,
      dialogStatus: "",
      alipayDev_form: {
        ID: "",
        PcmaymhineID: "",
        CpnID: "",
        DevSn: "",
        BizTid: "",
        SMID: "",
        Typ: "",
        PayOrg: "",
        Area: "",
        MrChNo: "",
        ErpOrg: "",
        ErpPosID: "",
        ErpRcv: "",
      },
      alipayDev_details_form: {
        ID: "",
        PcmaymhineID: "",
        CpnID: "",
        DevSn: "",
        BizTid: "",
        SMID: "",
        Typ: "",
        PayOrg: "",
        Area: "",
        MrChNo: "",
        ErpOrg: "",
        ErpPosID: "",
        ErpRcv: "",
      },
      cpnoptions: [],
      cpnoptionsCopy: [],
      pcmaymhineList: [],
      pcmaymhineDic: {},
      form: {
        title: "新增/编辑",
        formTpye: 0,
        item: [],
        removeIdList: [],
        bindOrUnBindIdList: [],
        CpnID: "",
        rules: {
          payOrg: [
            { required: true, message: "请填写支付宝门店号", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (`item.${this.editRow}.payOrg` == rule.fullField) {
                  let isOk = /^[\d|\.]*$/.test(value);
                  if (!isOk) callback(new Error("支付宝门店号必须为数字值"));
                  else callback();
                } else {
                  callback();
                }
              },
              trigger: "blur",
            },
          ],
          smid: [{ required: true, message: "请填写SMID", trigger: "blur" }],
          devSn: [{ required: true, message: "请填写设备号", trigger: "blur" }],
          bizTid: [{ required: true, message: "请填写设id", trigger: "blur" }],
          pcmaymhineID: [
            //{ required: true, message: "请选择前置机", trigger: "change" },
          ],
          erpOrg: [
            {
              validator: (rule, value, callback) => {
                if (`item.${this.editRow}.erpOrg` == rule.fullField) {
                  let isOk = /^[\d|\.]*$/.test(value);
                  if (!isOk) callback(new Error("erp门店号必须为数字值"));
                  else callback();
                } else {
                  callback();
                }
              },
              trigger: "blur",
            },
          ],
        },
      },
      editRow: -1,
      addRow: -1,
      cpnSelectDisabled: false,
      isConfirm: false
    };
  },
  // computed: {
  //   addRow:{
  //     get(){
  //       console.log("this.addRow.get",this._addRow);
  //       return this._addRow;
  //     },
  //     set(val){
  //       console.log("this._addRow",val);
  //       this._addRow=val;
  //       this.editRow=val;
  //     }
  //   }
  // },
  mounted() {
    var userinfo = JSON.parse(sessionStorage.getItem("userinfo"));
    this.logincpnid = userinfo.cpnId;
    this.loginid = sessionStorage.getItem("id");
    backstage.GeCpntListItems(this);
  },
  activated() {
    backstage.GeCpntListItems(this);
  },
  created() {
    var userinfo = JSON.parse(sessionStorage.getItem("userinfo"));
    this.logincpnid = userinfo.cpnId;
    this.loginid = sessionStorage.getItem("id");
    this.fetchData();
  },
  methods: {
    onPcmaymhineChange(val,scope){
      
      let list=this.pcmaymhineList.filter(x=>x.pcmaymhineID==val);
      if(list && list.length>0){
        let item=list[0];
        this.form.item[scope.$index].act=item.act;
        this.form.item[scope.$index].payChannel=item.payChannel;
        this.form.item[scope.$index].payChannelName=item.payChannelName;
      }
    },
    handleExcelSuccess({ results, header }) {
      //console.log("handleSuccess", header, results);
      this.form.item = [];
      for (let item of results) {
        let AddItem = {};
        for (let key in item) {
          //console.log("key", key);
          let itemKey = mapHeaderDic[key];
          AddItem[itemKey] = item[key];
        }
        //console.log("AddItem", AddItem);
        this.form.item.push({
          ...AddItem,
          cpnID: this.logincpnid == "system" ? this.form.CpnID : this.logincpnid,
          isNew: true,
          isUpdate: false,
          isBind: 0,
          pcmaymhineID: "",
        });
        //this.setRowIndex(this.form.item.length - 1);
      }
    },
    beforeUpload(file) {
      //console.log("beforeUpload", file);
      const isLt1M = file.size / 1024 / 1024 < 1;
      if (isLt1M) {
        return true;
      }
      this.$message({
        message: "请不要上传大于1m的文件",
        type: "warning",
      });
      return false;
    },
    GetPcmaymhineAlisName(pcmaymhineID) {
      if (pcmaymhineID) {
        let arr = this.pcmaymhineList.filter(
          (x) => x.pcmaymhineID == pcmaymhineID
        );
        if (arr.length == 1) {
          return arr[0].PcmaymhineAlisName;
        }
      }
      return "";
    },
    showDevinfo(scope) {
      this.showDevRow = scope.row;
      //console.log("this.showDevRow",this.showDevRow);
      this.showDialogVisible = true;

    },
    saveRow(e) {
      //var reg = /^[\d|\.]*$/;
      //console.log("refSaveForm", this.$refs.refSaveForm);
      //console.log("this.form",this.form);
      this.$refs.refSaveForm.validate((isOk, Fields) => {
        if (!isOk) {
          for (let key in Fields) {
            let element = Fields[key];
            if (element && element.length > 0) {
              var index=element[0].field.split(".")[1];
              if(index===`${this.editRow}`){
                this.$message(element[0].message);
              }
              
              return;
            }
          }
        } else {
          this.setRowIndex(-1);
        }
      });
    },
    saveRowBtn(scope) {
      //console.log("scope", scope);
      this.$confirm("是否保存更改？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "放弃",
        type: "warning",
      })
        .then(() => {
          this.saveForm(scope.row);
          this.setRowIndex(-1);
        })
        .catch((err) => {
          this.fetchData();
          this.setRowIndex(-1);

        });

    },
    delListBtn(scope) {
      console.log("scope", scope.row);
      this.deleteClick(scope.row);
      // this.$confirm(`是否删除【】？`, "提示", {
      //   confirmButtonText: "确定",
      //   cancelButtonText: "取消",
      //   type: "warning",
      // }).then(() => {

      //     this.setRowIndex(-1);
      // }).catch((err) => {
      //     this.fetchData();
      //     this.setRowIndex(-1);

      // });
    },
    /**
     * 设置行编辑位置
     * @param {index} val
     */
    setRowIndex(val) {
      this.addRow = val;
      this.editRow = val;
    },
    handleClose(done) {
      console.log("done", done);
      this.setRowIndex(-1);
      this.showImportState = false;
      //this.saveFormList();
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleFilter() {
      this.listQuery.page = 1;
      this.fetchData();
    },
    handleCreate() {
      this.setRowIndex(-1);
      this.dialogStatus = "create";
      this.showImportState = false;
      this.dialogFormVisible = true;

      this.alipayDev_form = {
        ID: "",
        PcmaymhineID: "",
        CpnID: this.alipayDev_form.CpnID,
        DevSn: "",
        BizTid: "",
        SMID: "",
        Typ: "",
        PayOrg: "",
        Area: "",
        MrChNo: "",
        ErpOrg: "",
        ErpPosID: "",
        ErpRcv: "",
      };
      if (this.logincpnid != "system") {
        console.log("logincpnid", this.logincpnid);
        this.form.CpnID = this.logincpnid;
        this.formCpnChange(this.logincpnid, true);
      } else {
        this.form.CpnID = "";
      }

      this.cpnSelectDisabled = false;
    },
    handleImport() {
      this.setRowIndex(-1);
      this.showImportState = true;
      this.dialogStatus = "create";
      this.dialogFormVisible = true;
      this.alipayDev_form = {
        ID: "",
        PcmaymhineID: "",
        CpnID: this.alipayDev_form.CpnID,
        DevSn: "",
        BizTid: "",
        SMID: "",
        Typ: "",
        PayOrg: "",
        Area: "",
        MrChNo: "",
        ErpOrg: "",
        ErpPosID: "",
        ErpRcv: "",
      };
      if (this.logincpnid != "system") {
        console.log("logincpnid", this.logincpnid);
        this.form.CpnID = this.logincpnid;
        this.formCpnChange(this.logincpnid, false);
      } else {
        this.form.CpnID = "";
      }

      this.cpnSelectDisabled = false;
    },
    formCpnChange(cpnid, isAdd) {
      //if(this.showImportState)return;
      if (this.form.item.length > 0) {
        let hasDataCount = 0;
        for (let item of this.form.item) {
          if (!this.isNoData(item)) {
            hasDataCount += 1;
          }
        }
        if (hasDataCount > 0) {
          this.$confirm("切换企业将清空数据，是否切换？", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
            .then(() => {
              var params = new URLSearchParams();
              params.append("CpnID", cpnid);
              backstage.Get_Cpn_Pcmaymhine_List(this, params);
              this.clearList();
              if (isAdd) {
                if (cpnid && cpnid.length > 0) {
                  console.log("cpnid", cpnid);
                  this.addList();
                }
              }
            })
            .catch((err) => {
              console.log(err);
              this.$message({
                type: "info",
                message: "已取消切换",
              });
            });
        } else {
          var params = new URLSearchParams();
          params.append("CpnID", cpnid);
          backstage.Get_Cpn_Pcmaymhine_List(this, params);
          this.clearList();
          if (isAdd) {
            if (cpnid && cpnid.length > 0) {
              console.log("cpnid", cpnid);
              this.addList();
            }
          }

        }
      } else {
        var params = new URLSearchParams();
        params.append("CpnID", cpnid);
        backstage.Get_Cpn_Pcmaymhine_List(this, params);
        console.log("isAdd", isAdd);
        if (isAdd) {
          if (cpnid && cpnid.length > 0) {
            console.log("cpnid", cpnid);
            this.addList();
          }
        }
      }
    },
    editOk(row, index) {
      row.isUpdate = true;
      if (this.addRow != -1) {
        this.$refs.refSaveForm.validate((isOk, Fields) => {
          console.log("Fields", Fields);
          if (!isOk) {
            for (let key in Fields) {
              let element = Fields[key];
              if (element && element.length > 0) {
                this.$message(element[0].message);
                return;
              }
            }
          } else {
            this.setRowIndex(-1);
            this.editRow = index;
            if(this.showImportState)this.addRow=index;
          }
        });
      } else {
        this.editRow = index;
        if(this.showImportState)this.addRow=index;
      }
    },
    /**
     * 弹窗取消
     */
    dialogCancel() {
      this.form.item = [];
      this.form.removeIdList = [];
      this.form.bindOrUnBindIdList = [];
      this.form.CpnID = "";

      //this.cpnoptions=[];
      this.dialogFormVisible = false;
    },
    /**
     * 弹窗确认
     */
    dialogConfirm() {
      let thisobj = this;
      this.isConfirm = true;
      this.saveFormList((body) => {
        console.log("body", body);
        this.form.item = [];
        this.form.removeIdList = [];
        this.form.bindOrUnBindIdList = [];
        this.form.CpnID = "";
        thisobj.$message({
          showClose: true,
          message: body.message,
          type: "success",
          duration: 2000,
        });
        thisobj.fetchData();
        thisobj.dialogFormVisible = false;
        this.isConfirm = false;
      }, () => {
        this.isConfirm = false;
      });
    },
    /**
     * 清空列表
     */
    clearList() {
      this.form.item = [];
      this.setRowIndex(-1);
    },
    /**
     * 添加一行
     */
    addList() {
      this.form.item.push({
        ID: "",
        pcmaymhineID: "",
        cpnID: this.logincpnid == "system" ? this.form.CpnID : this.logincpnid,
        devSn: "",
        bizTid: "",
        smid: "",
        typ: 0,
        payOrg: "",
        area: "",
        mrChNo: "",
        erpOrg: "",
        erpPosID: "",
        erpRcv: "",
        pcmaymhineAlisName: "",
        dt: "0001-01-01T00:00:00",
        isNew: true,
        isUpdate: false,
        isBind: 0,
      });
      this.setRowIndex(this.form.item.length - 1);
    },
    /**
     * 判断是否为空
     */
    isNoData(item) {
      let {
        pcmaymhineID,
        devSn,
        bizTid,
        smid,
        payOrg,
        erpOrg,
        erpPosID,
        erpRcv,
      } = item;
      return (
        pcmaymhineID == "" &&
        devSn == "" &&
        bizTid == "" &&
        smid == "" &&
        payOrg == "" &&
        erpOrg == "" &&
        erpPosID == "" &&
        erpRcv == ""
      );
    },
    verifyData(item) {
      let {
        pcmaymhineID,
        devSn,
        bizTid,
        smid,
        payOrg,
      } = item;
      return (
        pcmaymhineID == "" ||
        devSn == "" ||
        bizTid == "" ||
        smid == "" ||
        payOrg == ""
      );
    },
    delList(item, index) {
      this.$confirm("是否确认删除？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let endItem = this.form.item[this.form.item.length - 1];
          console.log("endItem", endItem);
          if (endItem && this.verifyData(endItem) && (this.editRow!=-1 || this.addRow!=-1)) {
            console.log(this.editRow,this.addRow);
            this.form.item.splice(this.form.item.length - 1, 1);
          }
          this.form.item.splice(index, 1);

          if (item.id && !item.isNew) {
            //如果是在修改的时候删除其中一个数据，则保存Id，方便后端做删除操作
            this.form.removeIdList.push(item.id);
          }
          this.setRowIndex(-1);
          //this.saveRow();
        })
        .catch((err) => {
          console.log(err);
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    bindDevice(idList, type) {
      let _this = this;
      this.$confirm(`确认${(type ? "绑定" : "解绑")}设备吗？`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "info",
      })
        .then((a) => {
          this.listLoading = true;
          var params2 = new URLSearchParams();
          params2.append("AlipayDevIDList", JSON.stringify(idList));
          backstage.BindOrUnBindDevice(this, params2, () => {
            this.$message({
              type: "info",
              message: `${(type ? "绑定" : "解绑")}成功`,
            });
            _this.fetchData();
            _this.listLoading = false;
          });
        })
        .catch(() => {
          this.listLoading = false;
        });


    },
    addBindDevice(item, rowIndex) {
      let index = this.form.bindOrUnBindIdList.findIndex(id => id == item.id);
      console.log("addBindDevice", index);
      if (index != -1) {
        this.form.bindOrUnBindIdList.splice(index, 1);
      } else {
        this.form.bindOrUnBindIdList.push(item.id);
      }

      if (this.form.item[rowIndex].isBind == 0) {
        this.form.item[rowIndex].isBind = 1;
      } else {
        this.form.item[rowIndex].isBind = 0;
      }
    },

    /**
     * 表格合并
     * @param {*} param0
     */
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 10) {
        if (row.rowSpan >= 1) {
          return {
            rowspan: row.rowSpan,
            colspan: 1,
          };
        } else {
          return {
            rowspan: 0,
            colspan: 0,
          };
        }
      }
    },
    deleteClick(row) {
      this.listLoading = true;
      var multis = [];
      var params = new URLSearchParams();
      if (row == undefined || row == "") {
        var arr = this.multipleSelection;
        if (arr == undefined || arr.length <= 0) {
          this.$message({
            showClose: true,
            message: "请至少选中一行",
            type: "error",
          });
          this.listLoading = false;
          return;
        } else {
          for (var i = 0; i < arr.length; i++) {
            multis.push(arr[i].id);
          }
          params.append("delds", JSON.stringify(multis));
        }
      } else {
        multis.push(row.id);
        params.append("delds", JSON.stringify(multis));
      }
      this.$confirm("确认删除吗？(已绑定的设备请先解绑)", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "error",

      })
        .then((a) => {
          this.listLoading = true;
          backstage.Del_alipayDev(this, params);
          this.$message({
            type: "info",
            message: "删除成功，已跳过已绑定的设备",
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
          this.listLoading = false;
        });
    },
    handleClick(row, index, formTpye = 0, title = "新增/编辑",rowSpan=null) {
      this.form.formTpye = formTpye;
      this.form.title = title;

      this.setRowIndex(-1);

      if (this.logincpnid != "system") {
        this.form.CpnID = this.logincpnid;
        console.log("logincpnid", this.logincpnid);
        this.formCpnChange(this.logincpnid, false);
      } else {
        console.log("row.cpnID", row.cpnID);
        this.form.CpnID = row.cpnID;
        this.formCpnChange(row.cpnID, false);
      }
      if(rowSpan==null)rowSpan=row.rowSpan;
      console.log("handleClick",index,rowSpan);
      let arr = this.alipayDev_Data.slice(index, rowSpan + index);
      for (let index = 0; index < arr.length; index++) {
        const element = arr[index];
        this.form.item.push({ ...element, isNew: false, isUpdate: false });
      }
      this.cpnid = "";

      //每次打开对话框将cpnoptions拷贝给cpnoptionsCopy
      this.cpnoptionsCopy = [...this.cpnoptions];

      this.alipayDev_form.ID = row.id;
      this.alipayDev_form.PcmaymhineID = row.pcmaymhineid;
      this.alipayDev_form.CpnID = row.cpnID;
      this.alipayDev_form.DevSn = row.devsn;
      this.alipayDev_form.BizTid = row.biztid;
      this.alipayDev_form.SMID = row.smid;
      this.alipayDev_form.Typ = row.typ;
      this.alipayDev_form.PayOrg = row.payorg;
      this.alipayDev_form.Area = row.area;
      this.alipayDev_form.MrChNo = row.mrchno;
      this.alipayDev_form.ErpOrg = row.erporg;
      this.alipayDev_form.ErpPosID = row.erpposid;
      this.alipayDev_form.ErpRcv = row.erprcv;

      this.cpnSelectDisabled = true;

      // 修改信息
      this.dialogFormVisible = true;
    },

    saveForm(formData) {
      var params = new URLSearchParams();
      let form = this.alipayDev_form;
      console.log("formData", { ...formData });
      if (formData) {
        // form={};
        // form.ID =  formData.id || formData.ID;
        // form.PcmaymhineID =  formData.pcmaymhineid||formData.PcmaymhineID ;
        // form.CpnID =   formData.cpnID||formData.CpnID;
        // form.DevSn =   formData.devsn||formData.DevSn ;
        // form.BizTid =   formData.biztid||formData.BizTid;
        // form.SMID =   formData.smid|formData.SMID ;
        // form.Typ =    formData.typ||formData.Typ;
        // form.PayOrg =   formData.payorg||formData.PayOrg ;
        // form.Area =   formData.area||formData.Area ;
        // form.MrChNo =  formData.mrchno||formData.MrChNo ;
        // form.ErpOrg =   formData.erporg||formData.ErpOrg ;
        // form.ErpPosID =   formData.erpposid||formData.ErpPosID ;
        // form.ErpRcv =  formData.erprcv||formData.ErpRcv ;
        form = mapObjUtil.map(formData, form);
      }

      console.log("form", form);
      //return
      params.append("ID", form.ID);
      params.append("PcmaymhineID", form.PcmaymhineID);
      params.append("CpnID", form.CpnID);
      params.append("DevSn", form.DevSn);
      params.append("BizTid", form.BizTid);
      params.append("SMID", form.SMID);
      params.append("Typ", form.Typ);
      params.append("PayOrg", form.PayOrg);
      params.append("Area", form.Area);
      params.append("MrChNo", form.MrChNo);
      params.append("ErpOrg", form.ErpOrg);
      params.append("ErpPosID", form.ErpPosID);
      params.append("ErpRcv", form.ErpRcv);

      backstage.Add_alipayDev(this, params);
    },
    /**
     * 批量保存
     * @param {回调函数} callback
     */
    saveFormList(callback, errorCallBack) {
      var params = new URLSearchParams();
      let list = [];
      for (let n of this.form.item) {
        n.cpnID = this.form.CpnID;
        if (n.isNew || n.isUpdate) {
          list.push(n);
        }
      }
      params.append("AlipayDevList", JSON.stringify(list));
      backstage.Add_AlipayDev_List(this, params, () => {
        var params2 = new URLSearchParams();
        params2.append("AlipayDevIDList", JSON.stringify(this.form.bindOrUnBindIdList));
        backstage.BindOrUnBindDevice(this, params2, () => {
          var params3 = new URLSearchParams();
          params3.append("delds", JSON.stringify(this.form.removeIdList));
          backstage.Del_alipayDev(this, params3, callback, errorCallBack);
        }, errorCallBack);
      }, errorCallBack);
    },
    fetchData() {
      this.listLoading = true;
      // 搜索
      var params = new URLSearchParams();
      params.append(
        "Parms",
        '{"page":' +
        this.listQuery.page +
        ',"rows":' +
        this.listQuery.limit +
        "}"
      );
      params.append("Name", this.listQuery.title);
      params.append("CpnID", this.logincpnid == "system" ? this.listQuery.cpnID : this.logincpnid);
      params.append("SMID", this.listQuery.smid);
      params.append("PayOrg", this.listQuery.payOrg);
      params.append("BizTid", this.listQuery.bizTid);
      backstage.Get_alipayDev_List(this, params);
    },
    cpnmatch(val) {
      console.log("cpnmatch(val)", val);
      if (val) {
        let result = [];
        this.cpnoptions.forEach((item) => {
          let matchRes = PinYinMatch.match(item.label, val);
          if (matchRes) {
            result.push(item);
          }
        });
        this.cpnoptionsCopy = result;
      } else {
        this.cpnid = "";
        backstage.GeCpntListItems(this);
      }
    },
  },
};
// 后台事件
var backstage = {
  // 获取Mngrbaseinfo集合
  Get_alipayDev_List: function (thisobj, params) {
    AjaxToken(
      thisobj,
      "Get_alipayDev_List",
      params,
      "post",
      function (res) {
        var body = res.data.data;
        let dic = {};
        for (let index = 0; index < body.rows.length; index++) {
          const element = body.rows[index];
          if (!dic[element.cpnID]) dic[element.cpnID] = 1;
          else dic[element.cpnID] = dic[element.cpnID] + 1;
        }
        for (let key in dic) {
          for (let index = 0; index < body.rows.length; index++) {
            const element = body.rows[index];
            if (element.cpnID == key) {
              element.rowSpan = dic[key];
              break;
            }
          }
        }
        console.log("body.rows", body.rows);
        thisobj.alipayDev_Data = body.rows;
        thisobj.listQuery.page = body.page;
        thisobj.listQuery.total = body.records;
        thisobj.listLoading = false;
      },
      function (err) { }
    );
  },
  Add_alipayDev: function (thisobj, params) {
    AjaxToken(
      thisobj,
      "Add_alipayDev",
      params,
      "post",
      function (res) {
        var body = res.data;
        if (body.success) {
          thisobj.$message({
            showClose: true,
            message: body.message,
            type: "success",
            duration: 2000,
          });
          thisobj.fetchData();
          thisobj.dialogFormVisible = false;
        } else {
          thisobj.$message({
            showClose: true,
            message: body.message,
            type: "error",
          });
        }
      },
      function (err) { }
    );
  },
  Add_AlipayDev_List: function (thisobj, params, callback = null, errorCallBack = null) {
    AjaxToken(
      thisobj,
      "Add_AlipayDev_List",
      params,
      "post",
      function (res) {
        var body = res.data;
        if (body.success) {
          if (callback) {
            callback();
            return;
          }
          thisobj.$message({
            showClose: true,
            message: body.message,
            type: "success",
            duration: 2000,
          });
          thisobj.fetchData();
          thisobj.dialogFormVisible = false;
        } else {
          thisobj.$message({
            showClose: true,
            message: body.message,
            type: "error",
          });
          errorCallBack && errorCallBack();
        }
      },
      function (err) { errorCallBack && errorCallBack(); }
    );
  },
  Del_alipayDev: function (thisobj, params, callback = null, errorCallBack = null) {
    AjaxToken(
      thisobj,
      "Del_alipayDev",
      params,
      "post",
      function (res) {
        thisobj.listLoading = true;
        var body = res.data;
        if (body.success) {
          if (callback) {
            callback(body);
            return;
          }
          thisobj.$message({
            showClose: true,
            message: body.message,
            type: "success",
            duration: 2000,
          });
          thisobj.fetchData();
          thisobj.dialogFormVisible = false;
        } else {
          thisobj.$message({
            showClose: true,
            message: body.message,
            type: "error",
          });
          errorCallBack && errorCallBack();
        }
      },
      function (err) { if (errorCallBack) errorCallBack() }
    );
  },
  BindOrUnBindDevice: function (thisobj, params, callback = null, errorCallBack) {
    AjaxToken(
      thisobj,
      "BindOrUnBindDevice",
      params,
      "post",
      function (res) {
        thisobj.listLoading = true;
        var body = res.data;
        if (body.success) {
          if (callback) {
            callback(body);
            return;
          }
          thisobj.$message({
            showClose: true,
            message: body.message,
            type: "success",
            duration: 2000,
          });
          thisobj.fetchData();
          //thisobj.dialogFormVisible = false;
        } else {
          thisobj.$message({
            showClose: true,
            message: body.message,
            type: "error",
          });
          errorCallBack && errorCallBack();
        }
        thisobj.listLoading = false;
      },
      function (err) { errorCallBack && errorCallBack() }
    );
  },
  Get_Cpn_Pcmaymhine_List: function (thisobj, params) {
    AjaxToken(
      thisobj,
      "Get_Cpn_Pcmaymhine_List",
      params,
      "post",
      function (res) {
        for (let index = 0; index < res.data.data.length; index++) {
          const element = res.data.data[index];

          thisobj.pcmaymhineDic[element.pcmaymhineID] =
            element.pcmaymhineAlisName;
        }
        thisobj.pcmaymhineList = res.data.data;
        //console.log("Get_Cpn_Pcmaymhine_List",thisobj.pcmaymhineList);
        //thisobj.listLoading = false;
      },
      function (err) { }
    );
  },
  GeCpntListItems: function (thisobj) {
    SelectAjax(
      "GeCpntListItems?val=" + thisobj.cpnid + "",
      function (response) {
        var body = response.data;
        thisobj.cpnoptions = [];
        thisobj.cpnoptionsCopy = [];
        body.data.forEach((element) => {
          thisobj.cpnoptions.push({
            value: element.value,
            label: element.text,
          });
          thisobj.cpnoptionsCopy.push({
            value: element.value,
            label: element.text,
          });
        });
      },
      function (error) { }
    );
  },
};
</script>

